<template>
  <a-card title="供应商管理" style="margin-top:10px">
    <a-table bordered :pagination="false" :columns="shop" :data-source="supplyList">
      <span slot="defaultStatus" slot-scope="txt, record" style="margin-left:5px">
        <span v-if="record.defaultStatus == 0">
          否
        </span>
        <span v-else>
          是
        </span>
      </span>
      <template slot="action" slot-scope="txt, record,i">
        <a class="mr-10" @click="toSupply(record, i)">
          编辑
        </a>
        <a-popconfirm :title="`确定要删除该项吗?`" @confirm="deleteSupply(i)">
          <a class="mr-10">
            删除
          </a>
        </a-popconfirm>
        <a class="mr-10" @click="sync(record)" v-if="record.defaultStatus == 0">
          默认
        </a>
        <a class="mr-10" @click="changePrice(record)">
          维护价格
        </a>
      </template>
    </a-table>
    <a-button type="dashed" style="width: 100%;margin-top: 20px;" @click="toSupply('')">
      <a-icon type="plus" />添加供应商
    </a-button>
    <supplyAdd v-if="showSupply" :supplyDetail="supplyDetail" :supplyIndex="supplyIndex" @closeSupply="closeSupply">
    </supplyAdd>
    <priceAdd v-if="showPrice" :list="list" :id="id" @closePrice="closePrice">
    </priceAdd>

  </a-card>

</template>
<script>
import supplyAdd from './supplyAdd.vue'
import priceAdd from './priceAdd.vue'
import { supplyList } from '@api/material/index'

const shop = [
  {
    title: '供应商编号',
    dataIndex: 'supplyCode'
  },
  {
    title: '供应商简称',
    dataIndex: 'name'
  },
  {
    title: '供应商物料编号',
    dataIndex: 'supplyAccCode'
  },
  {
    title: '供应商物料名称',
    dataIndex: 'supplyAccName'
  },
  {
    title: '采购单位',
    dataIndex: 'purchasingUnit'
  },
  {
    title: '默认供应商',
    scopedSlots: { customRender: 'defaultStatus' }
  },
  {
    title: '特殊费用',
    dataIndex: 'specialExpense'
  },
  {
    title: '模具费',
    dataIndex: 'mouldExpense'
  },
  {
    title: '特殊费用备注',
    dataIndex: 'specialExpenseRemark'
  },
  {
    title: '操作',
    width: 220,
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  components: {
    supplyAdd,
    priceAdd
  },
  props: {
    accId: {
      type: Number,
      default: null
    },
    priceList: {
      type: Array,
      default: null
    }
  },
  data() {
    return {
      shop,
      supplyList: [],
      showSupply: false,
      showPrice: false,
      supplyDetail: {},
      supplyIndex: null,
      list: [],
      id: ''
    }
  },
  watch: {
    accId(newVal, oldVal) {
      if (newVal && newVal !== oldVal) {
        this.loadAccSupply()
      }
    },
    priceList(newVal, oldVal) {
      if (newVal && newVal !== oldVal) {
        this.list = newVal
      }
    },
  },
  created() { },
  mounted() {
    if (this.accId) {
      this.loadAccSupply()
    }
  },
  methods: {
    async loadAccSupply() {
      const res = await supplyList({ accId: this.accId })
      if (res.code == 200) {
        this.supplyList = res.data
      } else {
        if (res.msg) {
          this.$message.error(res.msg)
        } else {
          this.$message.error('获取供应商列表失败！')
        }
      }
    },
    toSupply(record, i) {
      this.showSupply = true
      this.supplyIndex = i
      this.supplyDetail = record
    },
    deleteSupply(i) {
      this.supplyList = this.supplyList.filter((item, index) => index != i)
    },
    sync(values) {
      this.supplyList.map((item) => {
        if (item.supplyCode == values.supplyCode) {
          item.defaultStatus = 1
        } else {
          item.defaultStatus = 0
        }
      })
    },

    closeSupply(values, supplyIndex) {
      if (values) {
        if (this.supplyList.length) {
          if (supplyIndex || supplyIndex === 0) {
            const newArr = this.supplyList.filter(item => item.supplyCode == values.supplyCode)
            if (newArr.length > 1) {
              this.$message.error('该供应商编号已存在，请重新输入！')
            } else {
              this.supplyList[supplyIndex] = values

              this.showSupply = false
              this.$emit('changeSupply', this.supplyList)
            }
          } else {
            const newArr = this.supplyList.filter(item => item.supplyCode == values.supplyCode)
            if (newArr.length) {
              this.$message.error('该供应商编号已存在，请重新输入！')
            } else {
              this.supplyList.push(values)
              this.showSupply = false
              this.$emit('changeSupply', this.supplyList)

            }
          }
        } else {
          this.supplyList.push(values)
          this.showSupply = false
          this.$emit('changeSupply', this.supplyList)

        }
      } else {
        this.showSupply = false
      }
    },
    changePrice(record) {
      this.$emit('getPrice')
      this.$nextTick(() => {
        this.showPrice = true
      })
    },
    closePrice() {
      this.showPrice = false

    }

  }
}
</script>
